<html>
<!-- Copyright 2010 andry.virvich@gmail.com. All Rights Reserved. -->
  <head>
		<style type="text/css" title="currentStyle">
			@import "css/jquery-ui-1.7.2.custom.css";
			@import "css/table.css";
		</style>
		<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
		<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script>
	<script type="text/javascript" src="js/jquery.dataTables.min.js"></script> 
	<script type="text/javascript" src="js/xsddate.js"></script>
	<script type="text/javascript">
	
var tracker = {
	init: function(){
		tracker.initHeaderLinks();
		if(chrome.extension.getBackgroundPage().loader.tabs.length>0){
			$.map(chrome.extension.getBackgroundPage().loader.tabs, function(item, i){
				tracker.addTab(i, 
					(item.tabName?item.tabName:(item.projectName + " ("+item.projectFilter+")"))+
					" ["+chrome.extension.getBackgroundPage().loader.projectsData[i].length+"]");
				tracker.renderTableFromXml(i, item);
			})
			tracker.tabs();
		} else {
			tracker.error("First  of all you should add projects on Options page.")
		}
	},
	addTab: function(id, name){
		$("#tabHeader").append($("<LI />").append($("<A />").attr("href", "#div_"+id).text(name)));
		$("#tabs").append(
			$("<DIV />").attr("id", "div_"+id).append(
				$("<TABLE />").attr("id", "table_"+id).addClass("display")
			).append($("<BR />"))
		);
	},
	renderTableFromXml: function(id, item){
		try{
			$("#table_"+id).dataTable( {
			"bJQueryUI": false,
			"aaData": chrome.extension.getBackgroundPage().loader.projectsData[id],
			"aoColumns": [
					{ "bVisible": false},
					{ "bVisible": item.columns[0], "sTitle": "ID","sType": "numeric", "fnRender": function(obj) { return "<a target='_blank' href=\""+ obj.aData[ 0 ]+"\">"+obj.aData[ obj.iDataColumn ]+"</a>" ;}},
					{ "bVisible": item.columns[1], "sTitle": "State"},
					{ "bVisible": item.columns[2], "sTitle": "Status"},
					{ "bVisible": item.columns[3], "sTitle": "Owner", "fnRender": function(obj) { if(obj.aData[ obj.iDataColumn ].length>10)return obj.aData[ obj.iDataColumn ].substr(0, 10)+"..."; else return obj.aData[ obj.iDataColumn ];}},
					{ "bVisible": item.columns[4], "sTitle": "Assignee", "fnRender": function(obj) { if(obj.aData[ obj.iDataColumn ].length>10)return obj.aData[ obj.iDataColumn ].substr(0, 10)+"..."; else return obj.aData[ obj.iDataColumn ];}},
					{ "bVisible": item.columns[5], "sTitle": "Summary", "sClass": "Summary"},
					{ "bVisible": item.columns[6], "sTitle": "Stars","sType": "numeric", "sClass":"ShortField"},
					{ "bVisible": item.columns[7], "sTitle": "Published", "sClass": "Date"},
					{ "bVisible": item.columns[8], "sTitle": "Updated", "sClass": "Date"},
					{ "bVisible": item.columns[9], "sTitle": "Priority", "sClass": "ShortField"},
					{ "bVisible": item.columns[10], "sTitle": "Type", "sClass": "ShortField"}		
			]	
			} );	
		}catch(e){
			alert(e);
		}
	},
	tabs: function(){
					$('#tabs').tabs({
					select: function(event, ui) {
						localStorage.setItem('lastOpenedTab', ui.index);
					},
					selected: (localStorage.getItem('lastOpenedTab')?localStorage.getItem('lastOpenedTab'):0)
				});
	},
	initHeaderLinks: function(){
			$("#HeaderLink").append(
			).append(
				$("<a />").addClass("HeaderLink").attr("href", chrome.extension.getURL('options.html')).attr("target", "_blank").text("Options")
			).append(
				$("<a />").addClass("HeaderLink").attr("href", "javascript:{chrome.extension.getBackgroundPage().loader.update();window.close();}").text("Reload issues")
			).append(
				$("<a />").addClass("HeaderLink").attr("href", "http://code.google.com/p/issue-tracker-extension/").attr("target", "_blank").text("About extension")
			).append(
				$("<a />").addClass("HeaderLink").attr("href", "javascript:{chrome.extension.getBackgroundPage().logout();window.close();}").text("Logout")
			);
	},
	error: function(err){
		$("body").append($("<DIV />").addClass("error").text(err)).
			append($("<HR />")).
			append($("<INPUT />").attr("type","button").attr("value", "Options").click(function(){
					var url = chrome.extension.getURL('options.html');
					chrome.tabs.create({ url: url, selected: true });
			})
		);
		$("#tabs").hide();
	}
}

$(window).load(function () {
	chrome.extension.getBackgroundPage().loader.oauth.authorize(function() {
		chrome.browserAction.setIcon({ 'path' : 'images/16x16.png'});
		setTimeout(tracker.init, 0);
	});
});
	
	
	</script>

<body>
		<div id="HeaderLink" class="HeaderLink">	</div>
		<div id="tabs"style="min-width:720px; max-width:720px; font-size:10px;overflow:hidden;">
			<ul id="tabHeader">
			</ul>
		</div>

</body>
</html>